﻿
@{
    ViewBag.Title = "Alumnos de Servicio Social";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section css {
    @Styles.Render("~/Content/datetimepicker")
    @Styles.Render("~/Content/bootstrap-select")
}
<h2>@ViewBag.Title</h2>
<div class="table-responsive">
    <table id="grid-data" class="table table-condensed table-hover table-striped">
        <thead>
            <tr>
                <th data-column-id="SocialServiceId" data-formatter="link" data-sortable="false">Documentación</th>
                <th data-column-id="StudentId" data-formatter="StayModalityTypeColorStudentId" data-type="numeric" data-order="desc">Clave única</th>
                <th data-column-id="StudentName" data-formatter="StayModalityTypeColorStudentName">Nombre Completo</th>
                <th data-column-id="StayModalityType" data-formatter="StayModalityType">Modalidad de la Estáncia</th>
                <th data-column-id="InitialDate" data-formatter="StayModalityTypeColorInitialDate">Fecha de inicio</th>
                <th data-column-id="EndDate" data-formatter="StayModalityTypeColorEndDate">Fecha de finalización</th>

            </tr>
        </thead>
    </table>
    </div>
    @section Scripts {
        @Scripts.Render("~/bundles/datetimepicker")
        @Scripts.Render("~/bundles/bootstrap-select")
        <script type="text/javascript">
            $(document).ready(function () {

                $("#grid-basic").bootgrid({
                    ajax: true,
                    post: function () {
                        /* To accumulate custom parameter with the request object */
                        return {
                        };
                    },
                    url: "@Url.Action("SocialServiceStudents")",
                    formatters: {
                        "link": function (column, row) {
                            var components = '<button type="button" class="btn btn-primary btn-sm documents-btn" aria-label="Left Align" title="Ver información"><span class="fontelloicon icon-eye-1" aria-hidden="true"></span></button>&nbsp;' +
                                '<a type="button" class="btn btn-primary btn-sm" aria-label="Left Align" title="Editar información" href=\"Index/' + row.SocialServiceId + '\"><span class="fontelloicon  icon-edit" aria-hidden="true"></span></a>';
                            return components;
                        },
                        "StayModalityType": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StayModalityType + ' </div>';
                            }
                            else { var components = '' + row.StayModalityType + ''; }
                            return components;
                        },
                        "StayModalityTypeColorStudentName": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StudentName + ' </div>';
                            }
                            else { var components = '' + row.StudentName + ''; }
                            return components;
                        },
                        "StayModalityTypeColorStudentId": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StudentId + ' </div>';
                            }
                            else { var components = '' + row.StudentId + ''; }
                            return components;
                        },
                        "StayModalityTypeColorInitialDate": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px;background-color: #9CF6A1">' + row.InitialDate + ' </div>';
                            }
                            else { var components = '' + row.InitialDate + ''; }
                            return components;
                        },
                        "StayModalityTypeColorEndDate": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div style="height: 40px; background-color: #9CF6A1">' + row.EndDate + ' </div>';
                            }
                            else { var components = '' + row.EndDate + ''; }
                            return components;
                        }
                        },
                labels: {
                    noResults: "Ningún elemento encontrado",
                    infos: "Mostrando del {{ctx.start}} al {{ctx.end}} de {{ctx.total}} elemento(s)",
                    loading: "Cargando",
                    refresh: "Actualizar",
                    search: "Buscar"
                },
                columnSelection: false,
                rowCount: 10
            });

                $('#InitialDate').datetimepicker({
                    useCurrent: false,
                    defaultDate: new Date().setDate(new Date().getDate() - new Date().getDay()),
                    daysOfWeekDisabled: [0],
                    locale: 'es',
                    ignoreReadonly: true
                });

                $('#EndDate').datetimepicker({
                    useCurrent: false,
                    defaultDate: new Date(),
                    daysOfWeekDisabled: [0],
                    locale: 'es',
                    ignoreReadonly: true
                });

                $(".datepicker").on("dp.change", function (e) {
                    $("#grid-data").bootgrid("reload");
                });
                $("#grid-data").bootgrid({
                    ajax: true,
                    post: function () {
                        /* To accumulate custom parameter with the request object */
                        return {
                        };
                    },
                    url: "@Url.Action("SocialServiceStudents")",
                    formatters: {
                        "link": function (column, row) {
                            var components = '<button type="button" class="btn btn-primary btn-sm documents-btn" aria-label="Left Align" title="Ver información"><span class="fontelloicon icon-eye-1" aria-hidden="true"></span></button>&nbsp;' +
                                '<a type="button" class="btn btn-primary btn-sm" aria-label="Left Align" title="Editar información" href=\"Index/' + row.SocialServiceId + '\"><span class="fontelloicon  icon-edit" aria-hidden="true"></span></a>';
                            return components;
                        },
                        "StayModalityType": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StayModalityType + ' </div>';
                            }
                            else { var components = '' + row.StayModalityType + ''; }
                            return components;
                        },
                        "StayModalityTypeColorStudentName": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StudentName + ' </div>';
                            }
                            else { var components = '' + row.StudentName + ''; }
                            return components;
                        },
                        "StayModalityTypeColorStudentId": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px; background-color: #9CF6A1">' + row.StudentId + ' </div>';
                            }
                            else { var components = '' + row.StudentId + ''; }
                            return components;
                        },
                        "StayModalityTypeColorInitialDate": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div  style="height: 40px;background-color: #9CF6A1">' + row.InitialDate + ' </div>';
                            }
                            else { var components = '' + row.InitialDate + ''; }
                            return components;
                        },
                        "StayModalityTypeColorEndDate": function (column, row) {
                            if (row.StayModalityType == "Practicas profesionales") {
                                var components = '<div style="height: 40px; background-color: #9CF6A1">' + row.EndDate + ' </div>';
                            }
                            else { var components = '' + row.EndDate + ''; }
                            return components;
                        },
                    },
                    labels: {
                        noResults: "Ningún elemento encontrado",
                        infos: "Mostrando del {{ctx.start}} al {{ctx.end}} de {{ctx.total}} elemento(s)",
                        loading: "Cargando",
                        refresh: "Actualizar",
                        search: "Buscar"
                    },
                    columnSelection: false,
                    rowCount: 10
                });
              
            });
        </script>
    }










